<template>
    <div class="visit">
        <el-breadcrumb separator="/">
            <el-breadcrumb-item>服务管理</el-breadcrumb-item>
            <el-breadcrumb-item>接待管理</el-breadcrumb-item>
            <el-breadcrumb-item>来访登记</el-breadcrumb-item>
        </el-breadcrumb>
        <div class="top">
            <div class="phone">
                <p>来访人电话</p>
                <div class="search">
                    <Search></Search>
                </div>
            </div>
            <div class="ipt-name">
                <p>来访人姓名</p>
                <div>
                    <Search></Search>
                </div>
            </div>
            <div class="data-time">
                <p>接待时间</p>
                <div class="data">
                    <Data></Data>
                </div>
            </div>
            <div class="come-status">
                <p>来访状态</p>
                <div class="data">
                    <Select></Select>
                </div>
            </div>
            <div class="btn">
                <BtnSearch></BtnSearch>
                <Reset></Reset>
            </div>
        </div>
    </div>
</template>

<script>
import Search from "@/components/Search";
import Data from "@/components/Data";
import BtnSearch from "@/components/BtnSearch";
import Reset from "@/components/Reset";
import Select from "@/components/Select";
export default {
    components: {
        Search,
        Data,
        BtnSearch,
        Reset,
        Select
    }
}
</script>

<style scoped lang="scss">
.visit {
    width: 1120px;
    margin: 0 auto;
    
}
.top {
    display: flex;
    margin-top: 20px;
    flex-wrap: wrap;
    background-color: #fff;
    padding: 20px 20px;
    height: 144px;
    position: relative;
    .phone,.data-time {
        display: flex;
        .search {
            width: 200px;
        }
    }
    .ipt-name {
        margin-left: 50px;
        display: flex;
        p {
            margin-right: 20px;
        }
    }
    .el-input::v-deep .el-input__inner {
        height: 32px;
    }
    .data-time {
        margin-left: 50px;
        p {
            margin-right: 10px;
        }
    }
    .come-status {
        display: flex;
        align-items: center;
        p {
            margin-right: 20px;
        }
    }
    .btn {
        position: absolute;
        bottom: 20px;
        right: 20px;
    }
}
</style>